<template>
	<view class="">
		<view class="s-input-wrap" style="margin:0">
			<view class="s-input-box flex-row">
				<text class="black-text">条码</text>
				<input @input="changeBarcode" v-model="form.barcode" @confirm="inputBarcode" class="s-input flex1" placeholder="扫描 / 输入条码" />
				<image v-if="form.barcode" class="s-input-icon clear-icon" src="/static/images/clear.png" @click="clearField('barcode')"></image>
				<image class="s-input-icon" src="/static/images/scan.png"></image>
			</view>
			<view class="s-input-box flex-row-between">
				<text class="black-text font-30">物料名称</text>
				<text class="black-text font-30">{{form && form.productName?form.productName:'---'}}</text>
			</view>
			<view class="s-input-box flex-row-between">
				<text class="black-text font-30">来源仓库</text>
				<text class="black-text font-30">{{form && form.storehouseNo?form.storehouseNo:'---'}}</text>
			</view>
			<view class="s-input-box flex-row-between">
				<text class="black-text font-30">来源库位</text>
				<text class="black-text font-30">{{form && form.storehouseLocationNo?form.storehouseLocationNo:'---'}}</text>
			</view>
		</view>
		<view class="s-input-wrap" style="margin:25rpx 0 0">
			<view class="s-input-box flex-row">
				<text class="black-text">目标库位</text>
				<input v-model="form.toLocationNo" @confirm="inputLocationNo" class="s-input flex1" placeholder="扫描 / 输入库位" />
				<image v-if="form.toLocationNo" class="s-input-icon clear-icon" src="/static/images/clear.png" @click="clearField('toLocationNo')"></image>
				<image class="s-input-icon" src="/static/images/scan.png"></image>
			</view>
			<view class="s-input-box flex-row-between">
				<text class="black-text font-30">目标仓库</text>
				<text class="black-text font-30">{{form && form.toStorehouseNo?form.toStorehouseNo:'---'}}</text>
			</view>
		</view>
		
		<view class="content-list-total flex-row-between">
			<button @click="submit" class="botton p-botton botton-big">确定</button>
		</view>
	</view>
</template>

<script>
	import { getProductByBarcode,getLocationByNo,transfer } from "./api"
	export default {
		data(){
			return{
				form:{}
			}
		},
		methods:{
			changeBarcode(){
				this.$set(this.form,'productName','');
				this.$set(this.form,'storehouseNo','');
				this.$set(this.form,'storehouseLocationNo','');
			},
			inputBarcode(){
				if(!this.form.barcode) return;
				// 根据物料编号获取物料
				getProductByBarcode(this.form.barcode).then(res=>{
					if(res.code == 200){
						if(!res.data){
							this.$set(this.form,'barcode','');
							this.$modal.msgError("条码不存在")
							return;
						}else{
							this.$set(this.form,'productNo',res.data.productNo);
							this.$set(this.form,'productName',res.data.productName);
							this.$set(this.form,'storehouseNo',res.data.storehouseNo);
							this.$set(this.form,'storehouseLocationNo',res.data.storehouseLocationNo);
						}
					}else{
						this.$modal.msgError(res.msg);
					}
				})
			},
			// 根据库位编号获取库位信息
			inputLocationNo(){
				if(!this.form.toLocationNo) return;
				getLocationByNo(this.form.toLocationNo).then(res=>{
					if(res.code == 200){
						if(!res.data){
							this.$modal.msgError("库位编号有误")
							this.$set(this.form,'toLocationNo','');
							return;
						}else{
							this.$set(this.form,'toStorehouseNo',res.data.storehouseNo);
						}
					}
				})
			},
			submit(){
				// 判断物料、库位不能为空
				if(!this.form.productName){
					this.$modal.msg("请输入条码")
					return;
				}
				if(!this.form.toStorehouseNo){
					this.$modal.msg("请输目标库位编号")
					return;
				}
				this.$modal.confirm('是否确认移库').then(() => {
					transfer({
						barcode:this.form.barcode,
						productNo:this.form.productNo,
						sourceLocationNo:this.form.storehouseLocationNo,
						sourceStorehouse:this.form.storehouseNo,
						targetLocationNo:this.form.toLocationNo,
						targetStorehouse:this.form.toStorehouseNo,
					}).then(res=>{
						if(res.code == 200){
							this.$modal.msgSuccess("操作成功")
							this.$set(this,'form',{});
						}
					})
				})
			}
		}
	}
</script>

<style>
</style>